$copy: () !default;
$copy: map-merge(
    (
        bg: rgba(0, 0, 0, 0.6),
        color: rgb(241, 239, 239),
        hover-bg: rgba(0, 0, 0, 0.2),
        hover-color: #eee,
    ),
    $copy
);

$bg: map-get($copy, bg);
$color: map-get($copy, color);
$hover-bg: map-get($copy, hover-bg);
$hover-color: map-get($copy, hover-color);

#cnblogs_post_body pre {
    position: relative;
}

.cnblogs_code {
    position: relative;
}

.cnblogs_code .copy-btns {
    z-index: 1;
}

pre:hover,
.cnblogs_code:hover {
    .copy-btns {
        visibility: visible;
    }
}

.copy-btns {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 3px 8px;
    visibility: hidden;
    color: $color;
    font-size: 12px;
    font-weight: 700;
    border-radius: 4px;
    user-select: none;
    cursor: pointer;
    transition: all 0.2s;
}

#cnblogs_post_body {
    .copy-btns {
        background-color: $bg;
        &:hover {
            background-color: $hover-bg;
            color: $hover-color;
        }
    }
}
